<style lang="less">
 .main{
   width: 100%;
 }
.dataList{
  padding: 0 30upx;
  box-sizing: border-box;
}
 .main dl{
   width: 100%;
   height: 90upx;
   display: flex;
   border-bottom: 1px solid #ededed;
   justify-content: space-between;
   align-items: center;
   font-size:28upx;
   font-weight:500;
   color:rgba(51,51,51,1);
   line-height:34upx;
 }
 .dataList dl:last-child{
   border: none;
 }
 .main dl dd{
   padding-right: 60upx;
 }
 .rightBox{
   position: fixed;
   top:80upx;
   right: 10upx;
 }
 .rightBox view{
   display: block;
   text-align: center;
   color: #333;
 }
 .tit{
   display: block;
   height: 80upx;
   background:rgba(246,246,246,1);
   line-height: 80upx;
	 color: #999999;
	 padding-left: 30upx
 }
</style>
<template>
	<view class="container">
		 <view class='main'>
	      <scroll-view :scroll-into-view="toView" :style="{height:winHeight}" scroll-y="true" scroll-with-animation="true">
		   <view v-for="(item,i) in array" :id="item.title">
		     <text class='tit'>{{item.title}}</text>
	       <view class="dataList">
	         <dl v-for="(val,i) in item.data" @tap="brand(item.title,val.areaCode,val.country)">
	            <dt>
	              {{val.country}}
	            </dt>
	            <dd>
	              {{val.areaCode}}
	            </dd>
	         </dl>
	       </view>
		   </view>
	     </scroll-view>
		 </view>
		 <view class='rightBox'>
		     <view  @tap="goToAdvert" v-for="(item,i) in arrayRight" :data-id='item.title'>{{item.title}}</view>
		 </view>
	</view>
</template>

<script>
	import api from '@/common/api';
	export default {
		data() {
			return {
				winHeight:'',
				toView:'',
				array:[],
				arrayRight:[],
			}
		},
		onLoad() {
			this.checkoutphoneList()
		},
		onShow(){
		  let that=this;
		  that.checkoutphoneList()
		  //获取页面高度
		  uni.getSystemInfo({
		    success: function(res) {
		      //res.windowHeight为获取到的屏幕高度
		      that.winHeight = res.windowHeight - (res.windowWidth / 750) * 94 + 40 + "px";
		      // that.$apply()
		    }
		  });
		},
		methods: {
			// 获取国家号
			  async checkoutphoneList() {
			    const [err, res] = await api.checkoutphoneList({
			       header:{
			        'Content-Type': 'application/json'
			       }
			    })
			    if (res.data.code == 0 ) {
			      this.array=res.data.data
			      this.arrayRight=this.array.slice(1)
			    }
			  },
			  goToAdvert(e) {
			  	  const id = e.currentTarget.dataset.id;
			  	 this.toView=id
			  	 //弹框
			  	 uni.showToast({
			  	   icon:'none',
			  	   title: id,
			  	   duration: 1000
			  	 })
			  	},
			  	brand(title,areaCode,country){
			      let array = this.array;
			      let pages = getCurrentPages();
			      let currPage = pages[pages.length - 1];   //当前页面
			      let prevPage = pages[pages.length - 2];  //上一个页面
			      for (let i=0;i<this.array.length;i++) {
			        if(title==this.array[i].title){
			          for(let j=0; j<this.array[i].data.length; j++){
			            if(areaCode==this.array[i].data[j].areaCode && country==this.array[i].data[j].country){
			              prevPage.array=this.array[i].data[j]
						  uni.navigateBack()
			            }
			          }
			        }
			      }
			  	}
		}
	}
</script>
